<!--
	时间：2019-04-23
	描述：送货看板
-->

<!--<template>-->
<template>
	<div class="m-view-deliveryReport m-window">
		<!--查询条件-->
		<div class="m-condition" v-if="diaShow">
			<el-row :gutter="10">
				<el-form
					:model="ruleForm"
					ref="ruleForm"
					label-width="70px"
					:inline-message="true"
					label-position="left"
				>
					<el-col :span="6">
						<el-form-item label="客户" class="rightItem" v-if="permission == 2">
							<el-select
								value-key="id"
								v-model="company"
								placeholder="请选择客户"
								:clearable="true"
								@change="companyChange"
								ref="content"
								filterable
							>
								<el-option
									v-for="item in comOptions"
									:key="item.id"
									:label="item.companyName"
									:value="item"
								></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item label="公司" class="rightItem" v-if="permission == 1">
							<el-select
								value-key="id"
								v-model="company"
								placeholder="请选择公司"
								:clearable="true"
								@change="companyChange"
								ref="content"
								filterable
							>
								<el-option
									v-for="item in comOptions"
									:key="item.id"
									:label="item.companyName"
									:value="item"
								></el-option>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="4">
						<el-form-item label="送货日期" class="rightItem">
							<el-date-picker
								v-model="auditStartDate"
								type="date"
								placeholder="送货开始日期"
								value-format="yyyy-MM-dd"
							></el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="3">
						<el-date-picker
							v-model="auditEndDate"
							type="date"
							placeholder="送货结束日期"
							value-format="yyyy-MM-dd"
						></el-date-picker>
					</el-col>
					<el-col :span="4">
						<el-form-item label="审核日期" class="rightItem">
							<el-date-picker
								v-model="checkStartDate"
								type="date"
								placeholder="审核开始日期"
								value-format="yyyy-MM-dd"
							></el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="3">
						<el-date-picker
							v-model="checkEndDate"
							type="date"
							placeholder="审核结束日期"
							value-format="yyyy-MM-dd"
						></el-date-picker>
					</el-col>
					<el-col :span="4">
						<el-form-item label="采购单号" class="rightItem">
							<el-input
								v-model="purOrdNo"
								placeholder="采购订单号"
								@keyup.enter.native="searchReport"
								clearable
							></el-input>
						</el-form-item>
					</el-col>
				</el-form>
			</el-row>
			<el-row :gutter="10">
				<el-form
					:model="ruleForm"
					ref="ruleForm"
					label-width="70px"
					:inline-message="true"
					label-position="left"
				>
					<el-col :span="6">
						<el-form-item label="供应商" class="rightItem" v-if="permission == 1">
							<el-input
								placeholder="请选择供应商"
								v-model="selCusName"
								clearable
								@focus="showSupplierDialog"
								readonly
								@mouseenter.native="mouseEnter"
								@mouseleave.native="mounseLeave"
							>
								<el-button slot="append" icon="el-icon-search" @click="showSupplierDialog"></el-button>
								<span slot="suffix" @click="inputClearSon" class="m-cleanInput" v-show="inputClearBut">
									<i class="el-input_icon el-icon-circle-close el-input__clear"></i>
								</span>
							</el-input>
						</el-form-item>
					</el-col>
					<el-col :span="permission == 1?4:6">
						<el-form-item label="送货单号" class="rightItem">
							<el-input
								v-model="deliveryNo"
								placeholder="请输入送货单号"
								@keyup.enter.native="searchReport"
								clearable
							></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="permission == 1?3:7">
						<el-form-item label="物料编号" class="rightItem">
							<el-input v-model="materialNo" placeholder="物料编号" clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="permission == 1?4:7">
						<el-form-item label="物料描述" class="rightItem">
							<el-input v-model="materialText" placeholder="请输入物料描述" clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="2" class="m-floatRight">
						<el-button type="primary" @click="searchReport(7)">查询</el-button>
					</el-col>
				</el-form>
			</el-row>
		</div>

		<!--送货看板-->
		<div class="m-agTable m-bottom m-top2" v-if="diaShow">
			<ag-grid-vue
				class="m-agTableContent ag-theme-balham"
				:gridOptions="reportGridOptions"
				:columnDefs="reportColumnDefs"
				:rowData="rowData"
				v-loading="loading"
				rowSelection="single"
			></ag-grid-vue>
		</div>

		<!-- 供应商弹窗 -->
		<el-dialog
			title="供应商信息"
			:visible.sync="srmSupplierDialogVisible"
			width="50%"
			:before-close="srmSupplierDialogClose"
			v-dialogDrag
			:close-on-click-modal="false"
			:close-on-press-escape="false"
		>
			<srmSupplierInfo ref="srmSupplierInfo" :layout="layout" @setSrmSupplierInfo="setSrmSupplierInfo"></srmSupplierInfo>
		</el-dialog>
		<div class="m-page" v-if="diaShow">
			<el-pagination
				@size-change="reportHandleSizeChange"
				@current-change="reportHandleCurrentChange"
				@prev-click="reportHandlePrevClick"
				@next-click="reportHandleNextClick"
				:current-page="reportCurrentPage"
				:page-sizes="[30,50,100,150,200]"
				:page-size="reportPageSize"
				layout="total, sizes, prev, pager, next, jumper"
				:total="reportTotal"
			></el-pagination>
		</div>

		<div class="m-window" v-if="componentShow">
			<deliveryComponents
				@cancelComponents="cancelComponents"
				:getClickValue="getClickValue"
				:supplierInfo="supplierInfo"
				:pageLayOut="pageLayOut"
			></deliveryComponents>
		</div>
	</div>
</template>

<style lang="less">
.m-view-deliveryReport {
	.el-form-item {
		margin-bottom: 5px;
	}
}
</style>

<script>
import deliveryComponents from "@/views/myLogistics/deliveryComponents.vue";
import buttonLink from "@/components/buttonLink.js";
import srmSupplierInfo from "@/components/srmSupplierInfo.vue";
import supplierInfo from "@/public/supplierInfo.js";
import localeText from "@/i18n/agGridText";
import constant from "@/public/constant";
import _APIS from "@/api";
import gridOptions from 'lesso-common/public/gridOptions';

export default {
	props: {
		rmTab: {
			type: Function
		},
	},
	data () {
		return {
			//页面搜索条件
			comOptions: [], //公司列表
			layout: {},
			ruleForm: {},
			// company1:'',
			// company2:'',
			company: {},
			selCusName: '',
			purOrdNo: '',
			deliveryNo: '',
			auditStartDate: '',
			auditEndDate: '',
			checkStartDate: '',
			checkEndDate: '',
			materialNo: '',
			materialText: '',
			permission: '',
			srmSupplierDialogVisible: false,
			reportCurrentPage: 1,//当前页码
			reportPageSize: 30,//页容量
			reportTotal: 0,//数据总量
			inputClearBut: false,
			//ag-grid配置
			reportGridOptions: '',
			reportColumnDefs: [],
			reportRowSelection: "multiple",
			rowData: [],
			loading: false,

			//缓存搜索条件
			tempSearch: {
				company: "",
				selCusCode: "",
				purOrdNo: "",
				deliveryNo: "",
				auditStartDate: "",
				auditEndDate: "",
				checkStartDate: "",
				checkEndDate: "",
				materialNo: "",
				materialText: "",
			},

			//送货明细
			componentShow: false,
			diaShow: true,
			getClickValue: {},
			supplierInfo: [],
		}
	},
	created () {
		this.getAuthInfo()
	},

	beforeMount () {
		// 页面 ag-grid 配置
		this.reportGridOptions = Object.assign({
			context: {
				componentParent: this
			},
			enableColResize: true,
			localeText: localeText,
			enableCellChangeFlash: true,
			suppressRowClickSelection: true,
			enableFilter: false, //列过滤器
			enableSorting: true, //列排序
		}, gridOptions())

		//配置列表字段
		this.reportColumnDefs = [
			{ headerName: "送货单号", field: "deliveryNo", width: 150, cellRenderer: buttonLink },
			{ headerName: "行号", field: "deliveryIMxNo", width: 90 },
			{ headerName: "送货日期", field: "deliveryDate", width: 120 },
			{ headerName: "供应商", field: "supplierCode", width: 120, hide: this.permission === 2 ? true : false },
			{ headerName: "供应商名称", field: "supplierName", width: 250, hide: this.permission === 2 ? true : false },
			{ headerName: "采购订单号", field: "purOrdNo", width: 120 },
			{ headerName: "行项目号", field: "purOrdMxNo", width: 100 },
			{ headerName: "公司", field: "companyCode", width: 90 },
			{ headerName: "公司名称", field: "companyName", width: 200, tooltipField: 'companyName' },
			{ headerName: "运输方", field: "transportName", width: 200, tooltipField: 'transportName' },
			{ headerName: "审核状态", field: "auditState", width: 100 },
			{ headerName: "审核日期", field: "auditDate", width: 120 },
			{ headerName: "物料编号", field: "matCode", width: 100 },
			{ headerName: "物料描述", field: "matName", width: 300 },
			{ headerName: "订单数量", field: "orderAmount", width: 100 },
			{ headerName: "订单单位", field: "unitCode", width: 100 },
			{ headerName: "送货数量", field: "actualAmount", width: 100 },
			{ headerName: "在途数量", field: "wayAmount", width: 100 },
			{ headerName: "退货数量", field: "returnAmount", width: 100 },
			{ headerName: "确认单号", field: "comfirmNo", width: 120, hide: true },
			{ headerName: "确认数量", field: "comfirmAmount", width: 100 },
			{ headerName: "入库单号", field: "instockNo", width: 120, hide: true },
			{ headerName: "入库日期", field: "instockDate", width: 120, hide: true },
			{ headerName: "入库数量", field: "instockAmount", width: 100 },
		]
		let planAmountCol = {
			headerName: "计划数量",
			field: "planConAmount",
			width: 100
		}
		if (this.$global.isTransport) this.reportColumnDefs.splice(13, 1, planAmountCol)
	},
	mounted () {
	},
	methods: {
		// 选择公司名称回调
		companyChange (params) {
			if (this.permission == 1) {
				if (params) {
					this.layout.companyCode = params.companyCode;
					this.layout.auth = true;
					// this.layout.filterByUser = true;
					if (this.selCusCode)
						this.selCusCode = "";
					if (this.selCusName)
						this.selCusName = "";
				} else {
					this.layout = {};
					this.selCusName = "";
				}
			}
		},

		getAuthInfo () {
			//获取当前账号权限公司
			var obj = {};
			var that = this
			//帐号类型：4为供应商
			if (this.$global.user.userTypeId == 4) {
				obj.account = this.$global.user.userName;
				obj.userType = 2;
				this.selCusCode = constant.supplierData.supplierCode;//设置默认供应商编码
				this.permission = obj.userType;
				if (!this.$global.supplierData) {
					supplierInfo.getUserInfo(this.$global.user.userName).then((supplierInfo) => {
						that.supplierInfo = supplierInfo;
					})
				} else {
					that.supplierInfo.push(this.$global.supplierData);
				}
			}
			//帐号类型：1为内部员工
			else if (this.$global.user.userTypeId == 1) {
				obj.account = this.$global.user.oaNum;
				obj.userType = 1;
				this.permission = obj.userType;
			}
			_APIS.getAuthInfo(obj).then(function (response) {
				var data = response.data;
				if (data.code == 1) {
					//绑定公司选项
					if (data.rows.myMstCompany) that.comOptions = data.rows.myMstCompany;
				} else {
					that.comOptions = [];
				}
			}).catch((err) => {
				that.$alert(err.data.message, {
					showClose: false,
					confirmButton: "确定",
					customClass: "alertFailure"
				});
				that.comOptions = [];
			})
		},

		// 打开供应商弹窗
		showSupplierDialog () {
			var that = this;
			if (!this.layout.companyCode) {
				this.$alert("提示：请选择公司！", {
					showClose: false,
					confirmButtonText: "确定",
					customClass: "alertPrompt"
				});
				this.$refs.content.focus();
				return;
			} else {
				this.srmSupplierDialogVisible = true;
				this.$nextTick(_ => {
					that.$refs.srmSupplierInfo.search();
				});
			}
		},

		// 关闭供应商弹窗回调
		srmSupplierDialogClose (done) {
			this.$refs.srmSupplierInfo.keyWord = "";
			this.$refs.srmSupplierInfo.selSupplierOptions.api.setQuickFilter(this.$refs.srmSupplierInfo.keyWord);
			done();
		},

		// 回显选择的供应商信息
		setSrmSupplierInfo (msg) {
			if (msg.length > 0) {
				this.srmSupplierDialogVisible = false;
				this.selCusCode = msg[0].supplierCode;
				this.selCusName = msg[0].supplierName;
			}
		},

		//送货明细页面跳转
		setClickValue (value) {
			this.getClickValue = value.data;
			this.getClickValue.indexSign = 'deliveryReport';
			this.pageLayOut = "edit";
			this.diaShow = false;
			this.componentShow = true;
		},
		cancelComponents (msg) {
			if (msg) {
				var that = this;
				this.componentShow = false;
				this.diaShow = true;
				this.$nextTick(_ => {
					that.searchReport();
				})
			}
		},

		reportHandleSizeChange (params) {
			this.reportPageSize = params;
			this.getTempSearch();
			this.searchReport();
		},
		reportHandleCurrentChange (params) {
			this.reportCurrentPage = params;
			this.getTempSearch();
			this.searchReport();
		},
		reportHandlePrevClick () {
			this.reportCurrentPage = this.reportCurrentPage - 1;
			this.getTempSearch();
		},
		reportHandleNextClick () {
			this.reportCurrentPage += 1;
			this.getTempSearch();
		},

		//查询报表
		searchReport (type) {
			var that = this;
			let transportId = ''
			if (type === 7) {
				this.reportCurrentPage = 1;
			}

			if (this.permission === 2) {
				// if (!this.company) {
				// 	this.$alert("请选择客户", "消息提示", {
				// 		confirmButtonText: "确定"
				// 	});
				// 	return;
				// }
			}

			if (this.permission === 1) {
				// if (!this.company) {
				// 	this.$alert("请选择公司", "消息提示", {
				// 		confirmButtonText: "确定"
				// 	});
				// 	return;
				// }
			}
			this.loading = true;
			that.saveTempSearch(); //缓存搜索条件
			if (this.$global.isTransport) transportId = this.$global.transport.id
			_APIS.getDeliveryReport({
				companyCode: that.company.companyCode,
				supplierCode: that.selCusCode,
				purOrdNo: that.purOrdNo,
				deliveryNo: that.deliveryNo,
				deliverySt: that.auditStartDate,
				deliveryEt: that.auditEndDate,
				auditSt: that.checkStartDate,
				auditEt: that.checkEndDate,
				matCode: that.materialNo,
				matName: that.materialText,
				current: that.reportCurrentPage,
				size: that.reportPageSize,
				transportId: transportId || null
			}).then(function success (response) {
				var data = response.data;
				if (data.code == 1) {
					if (data.total > 0) {
						that.rowData = data.rows;
						that.rowData.forEach(item => {
							if (item.billState === 2) {
								item.auditState = '未审核';
							} else if (item.billState === 3) {
								item.auditState = '已审核';
							}
						})
						that.reportTotal = data.total;
						that.loading = false;
					} else {
						that.rowData = data.rows;
						that.reportTotal = 0;
						that.loading = false;
					}
				} else {
					that.$alert(data.info, {
						showClose: false,
						confirmButton: "确定",
						customClass: "alertFailure"
					}).then(() => {
						that.reportTotal = 0;
						that.loading = false;
					});
				}
			}, function error (err) {
				that.$alert("网络异常，查询失败！", {
					showClose: false,
					confirmButton: "确定",
					customClass: "alertFailure"
				}).then(() => {
					that.reportTotal = 0;
					that.loading = false;
				});
			})
		},

		// 输入框清除事件监听
		inputClearSon () {
			this.selCusCode = "";
			this.selCusName = "";
			this.inputClearBut = false;
		},

		// 供应商输入框鼠标移入事件监听
		mouseEnter () {
			if (this.selCusName != "")
				this.inputClearBut = true;
		},
		// 供应商输入框鼠标移出事件监听
		mounseLeave () {
			if (this.selCusName != "")
				this.inputClearBut = false;
		},


		//缓存查询条件
		saveTempSearch () {
			this.tempSearch.company = this.company.companyCode;
			this.tempSearch.selCusCode = this.selCusCode;
			this.tempSearch.purOrdNo = this.purOrdNo;
			this.tempSearch.deliveryNo = this.deliveryNo;
			this.tempSearch.auditStartDate = this.auditStartDate;
			this.tempSearch.auditEndDate = this.auditEndDate;
			this.tempSearch.checkStartDate = this.checkStartDate;
			this.tempSearch.checkEndDate = this.checkEndDate;
			this.tempSearch.materialNo = this.materialNo;
			this.tempSearch.materialText = this.materialText;
		},

		//读取缓存查询数据
		getTempSearch () {
			this.company.companyCode = this.tempSearch.company;
			this.selCusCode = this.tempSearch.selCusCode || this.selCusCode;
			this.purOrdNo = this.tempSearch.purOrdNo;
			this.deliveryNo = this.tempSearch.deliveryNo;
			this.auditStartDate = this.tempSearch.auditStartDate;
			this.auditEndDate = this.tempSearch.auditEndDate;
			this.checkStartDate = this.tempSearch.checkStartDate;
			this.checkEndDate = this.tempSearch.checkEndDate;
			this.materialNo = this.tempSearch.materialNo;
			this.materialText = this.tempSearch.materialText;
		}
	},

	components: {
		srmSupplierInfo,
		deliveryComponents
	},

	watch: {
		//处理时间
		auditStartDate: function () {
			if (!this.auditEndDate && this.auditStartDate) {
				this.$message.warning('送货结束时间不能为空')
			} else if (!this.auditStartDate && this.auditEndDate) {
				this.$message.warning('送货开始时间不能为空')
			} else if (this.auditStartDate && this.auditEndDate) {
				var s = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.auditStartDate)
				var e = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.auditEndDate)
				if (s && e) {
					if (s > e) {
						this.$message.warning('送货开始时间不能大于送货结束时间')
						return
					}
				}
			}
		},
		auditEndDate: function () {
			if (!this.auditEndDate && this.auditStartDate) {
				this.$message.warning('送货结束时间不能为空')
			} else if (!this.auditStartDate && this.auditEndDate) {
				this.$message.warning('送货开始时间不能为空')
			} else if (this.auditStartDate && this.auditEndDate) {
				var s = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.auditStartDate)
				var e = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.auditEndDate)
				if (s && e) {
					if (s > e) {
						this.$message.warning('送货开始时间不能大于送货结束时间')
						return
					}
				}
			}
		},
		checkStartDate: function () {
			if (!this.checkEndDate && this.checkStartDate) {
				this.$message.warning('审核结束时间不能为空')
			} else if (!this.checkStartDate && this.checkEndDate) {
				this.$message.warning('审核开始时间不能为空')
			} else if (this.checkStartDate && this.checkEndDate) {
				var s = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.checkStartDate)
				var e = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.checkEndDate)
				if (s && e) {
					if (s > e) {
						this.$message.warning('审核开始时间不能大于审核结束时间')
						return
					}
				}
			}
		},
		checkEndDate: function () {
			if (!this.checkEndDate && this.checkStartDate) {
				this.$message.warning('审核结束时间不能为空')
			} else if (!this.checkStartDate && this.checkEndDate) {
				this.$message.warning('审核开始时间不能为空')
			} else if (this.checkStartDate && this.checkEndDate) {
				var s = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.checkStartDate)
				var e = this.$utils.dateFormat("yyyy-MM-dd hh:mm:ss", this.checkEndDate)
				if (s && e) {
					if (s > e) {
						this.$message.warning('审核开始时间不能大于审核结束时间')
						return
					}
				}
			}
		},
	}
}
</script>
